<template>
	<view style="background-color: #f7f7f7;">
		<view class="top">
			<view class="back-btn" @click="backPage()">
				<view class="back-icon"></view>
			</view>
			<view style="text-align: center; font-size: 35rpx; color: #fff;">输入核销码</view>
			<view class="card">
				<view style="display: flex; justify-content: space-between; align-items: start; margin-top: 35rpx;"
					:style="{'height':checkImg ? '1200rpx' : '100rpx'}">
					<view style="color: #4c8efe;">输入核销码</view>
					<view
						style="display: flex; justify-content: space-between; align-items: center; border: 1px solid gray; border-radius: 20px; padding-left: 20rpx; width: 450rpx;">
						<input v-model="query.verificationCode" placeholder="请输入核销码" />
						<button
							style="width: 100rpx; height: 45rpx; font-size: 20rpx; color: #fff; background-color: #4c8efe; border-radius: 20px;"
							@click="showOrder">识别</button>
					</view>
				</view>
			</view>
		</view>
		<view>
			<view class="card" v-if="!checkImg">
				<view class="check_code">核销码MC1234-5678-9012-{{order.verificationCode}}</view>
				<view class="line"></view>
				<view class="big_title">服务内容</view>
				<view class="small_title">xxx标准洗车服务包含</view>

				<view class="small_title" v-for="item in services" key="item.id">
					{{item.name}}
				</view>
				<!-- <view class="small_title">轮胎轮毂冲洗清洁</view>
				<view class="small_title">车内吸尘</view>
				<view class="small_title">内饰脚垫简单除尘</view>
				<view class="small_title">（不包含虫尸、水泥、沥青和顽固物质清理等）</view>
				<view class="line"></view> -->
				<view class="big_title">订单信息</view>
				<view class="small_title" v-if="coupon.type == 0">订单价格：￥{{order.price/(coupon.discount*0.1)}}</view>
				<view class="small_title" v-if="coupon.type == 1">订单价格：￥{{order.price+coupon.preferentialMoney}}</view>
				<view class="small_title">实付金额：<span style="font-weight: 500;">￥{{order.price}}</span></view>
				<view class="small_title" v-if="coupon.type == 0">优惠金额：￥{{order.price/(coupon.discount*0.1)-order.price}}</view>
				<view class="small_title" v-if="coupon.type == 1">优惠金额：￥{{coupon.preferentialMoney}}</view>
				<view class="small_title">订单编号 {{order.id}}</view>
				<view class="small_title">支付时间 {{order.payTime}}</view>
				<view class="small_title">预约时间 {{order.reservationTime}}</view>
			</view>
			
			<view class="card" v-if="!show">
				<view class="">
					查询失败！
				</view>
			</view>
			<button v-if="!checkConfirm && !checkImg" @click="confirmCheck()"
				style="margin: 50rpx 100rpx; border-radius: 25px; background-color: #4c8efe; color: white;">确认核销</button>
			<button v-if="checkConfirm" @click="toIndex()"
				style="margin: 50rpx 100rpx; border-radius: 25px; background-color: #808080; color: white;">已核销</button>
		</view>

	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import request from '../../util/request';
	import baseUrl from '../../util/urlConfig';

	const checkImg = ref(true);
	const show = ref(true);
	const checkConfirm = ref(false);
	const merchant = ref({});
	const order = ref({});
	const services = ref([]);
	const coupon = ref({});
	const discount = ref(0);
	const query = ref({
		mid: '',
		status: 1,
		verificationCode: ''
	});
	const query1 = ref({
		orderId: 0,
		ids: []
	})
	
	const query2 = ref({
		merchantId: 0,
		income: 0
	})
	
	const vRecord = ref({
		mid: 0,
		oid: 0,
		name: '',
		username: '',
		price: 0
	});

	async function showOrder() {
		

		// request({
		// 	url: baseUrl + '/wwc/orders/list',
		// 	method: 'GET',
		// 	data: query.value,
		// 	success(res) {
		// 		console.log(res.data.rows[0]);
		// 		order.value = res.data.rows[0];
		// 	}
		// });

		// try {
		const res = await new Promise((resolve, reject) => {
			request({
				url: baseUrl + '/wwc/orders/list',
				method: 'GET',
				data: query.value,
				success(res) {
					resolve(res);
				},
				fail(err) {
					reject(err);
				}
			});
		});
		console.log(res.data);
		if(res.data.rows.length == 0){
			show.value = false;
			checkImg.value = true;
			return;
		}else if(res.data.rows.length > 1){
			checkImg.value = true;
			show.value = false;
			return;
		}else{
			checkImg.value = false;
			show.value = true;
		}
		
		order.value = res.data.rows[0];
		query2.value.income = order.value.price;
		console.log(order.value)

		query1.value.orderId = order.value.id;
		vRecord.value.oid = order.value.id;
		vRecord.value.price = order.value.price;
		console.log(order.value.id);

		const res1 = await new Promise((resolve, reject) => {
			request({
				url: baseUrl + '/wwc/orders/serviceListwwc',
				method: 'GET',
				data: query1.value,
				success(res) {
					resolve(res);
				},
				fail(err) {
					reject(err);
				}
			});
		});

		console.log(res1.data);
		query1.value.ids = res1.data.data;

		const res2 = await new Promise((resolve, reject) => {
			request({
				url: baseUrl + '/xyq/details/listwwc',
				method: 'POST',
				data: query1.value, //传对象
				success(res) {
					resolve(res);
				},
				fail(err) {
					reject(err);
				}
			});
		});

		console.log(res2.data.data);
		services.value = res2.data.data;
		
		const res3 = await new Promise((resolve, reject) => {
			request({
				url: baseUrl + '/wwc/coupon/' + order.value.couponId,
				method: 'GET',
				success(res) {
					resolve(res);
				},
				fail(err) {
					reject(err);
				}
			});
		});
		console.log(res3.data.data);
		coupon.value = res3.data.data;
		
		// return res.data.rows[0];
		// } catch (error) {
		//   console.error('获取订单失败:', error);
		//   throw error;
		// }
		// }
		
		
	}

	function backPage() {
		uni.navigateBack()
	}

	function confirmCheck() {
		uni.showModal({
			title: '核销此订单', // 弹框标题
			content: '请您仔细核对此订单，此操作不可撤销，请谨慎操作！', // 弹框内容
			confirmText: '确认', // 确认按钮文本
			cancelText: '取消', // 取消按钮文本
			success: (res) => {
				if (res.confirm) {
					// 用户点击了确定按钮
					console.log('用户点击了确定');
					order.value.status = 2;
					
					request({
						url: baseUrl + '/wwc/orders',
						method: 'PUT',
						data: order.value, //传对象
						success(res) {
							console.log(res);
							console.log(query2.value)
							
							// 先添加明细表， 再查询对应的提现表，然后更改提现表的数据
							request({
								url: baseUrl + '/xyq/service-details',
								method: 'POST',
								data: query2.value, //传对象
								success(res) {
									console.log(res);
									
								}
							});
							
						}
					});
					
					request({
						url: baseUrl + '/wwc/vRecord',
						method: 'POST',
						data: vRecord.value, //传对象
						success(res) {
							console.log(res);
							
						}
					});
					
					checkConfirm.value = true;
				} else if (res.cancel) {
					// 用户点击了取消按钮
					console.log('用户点击了取消');
					checkConfirm.value = false;
				}
			}
		});
	}

	function toIndex() {
		uni.redirectTo({
			url: '/pages/index/index'
		})
	}

	function getMerchant() {
		merchant.value = uni.getStorageSync('merchant');
		query.value.mid = merchant.value.id;
		query2.value.merchantId = merchant.value.id;
		vRecord.value.mid = merchant.value.id;
		console.log(query.value.mid);
	}

	getMerchant();
</script>

<style>
	@import "@/common/app.css";

	.card {
		border-radius: 20px;
		background-color: #fff;
		margin: 30rpx;
		padding: 30rpx 20rpx;
	}

	.check_code {
		font-weight: 600;
		text-align: center;
	}

	.line {
		width: 100%;
		height: 1px;
		background-color: gray;
		margin: 20rpx 10rpx;
	}

	.big_title {
		margin: 20rpx;
		font-weight: 600;
	}

	.small_title {
		margin: 20rpx;
	}

	.back-btn {
		margin-left: 20rpx;
		width: 50rpx;
		height: 50rpx;
		position: relative;
	}

	.back-icon {
		width: 30px;
		height: 30px;
	}

	.back-icon::before {
		content: "";
		position: absolute;
		width: 20px;
		height: 2px;
		background-color: #fff;
		top: 80rpx;
		left: 47rpx;
		transform: translate(-50%, -50%);
	}

	.back-icon::after {
		content: "";
		position: absolute;
		width: 10px;
		height: 10px;
		border-left: 2px solid #fff;
		border-bottom: 2px solid #fff;
		transform: rotate(45deg);
		top: 70rpx;
		left: 30rpx;
	}
</style>